<!-- 首页 -->
<template>
	<view>
		<u-navbar title="我要报名" :background="background"></u-navbar>
		<u-notice-bar mode="horizontal" :list="list"></u-notice-bar>
		<view class="page-box">
			<view class="fabu-btn-box">
				<view class="clear-btn" @click="clearText">清空</view>
				<view :class="[content=='' ? 'btn-disabled' : 'fabu-btn']" @click="submit">发布</view>
			</view>
			<view class="text-box">
				<u-input v-model="content" height="200" :auto-height="false" type="textarea" maxlength="1000"></u-input>
			</view>
			<u-upload :max-size="5 * 1024 * 1024" max-count="9" :action="action" :header="header" @on-success="onSuccess" @on-remove="onRemove"></u-upload>
		</view>
		<coin-popup></coin-popup>
		<user-auth></user-auth>
		<user-phone></user-phone>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	data() {
		var token = 'Bearer ' + uni.getStorageSync('token');
		var action = this.website.baseUrl + '/oss/oss/upload';
		return {
			background: {
				backgroundColor: '#fff',
			},
			content: '',
			topicIds: '',
			// 演示地址，请勿直接使用
			action: action,
			header: {
				'Authorization': token
			},
			fileList: [],
			customStyle: {
				backgroundColor: '#606266', // 注意驼峰命名，并且值必须用引号包括，因为这是对象
			},
			hotTopicList: [],
			login: {
				appId: '',
				encryptedData: '',
				code: '',
				iv: ''
			},
			uid: '',
			list: [
				'分享邀请一人可以免费申请推荐',
			],
		};
	},
	mounted () {
		this.init();
	},
	// 分享小程序
	onShareAppMessage(res) {
		return {
			title: '送你一个对象，快来「处CP」吧！',
			imageUrl: 'http://rbtnet.oss-cn-hangzhou.aliyuncs.com/test/20220914/58242695c2a8421b892eced5f1bd3b15.jpeg',
		};
	},
	onShareTimeline() {
		return {
			title: '送你一个对象，快来「处CP」吧！',
			imageUrl: 'http://rbtnet.oss-cn-hangzhou.aliyuncs.com/test/20220914/58242695c2a8421b892eced5f1bd3b15.jpeg',
		}
	},
	methods: {
		init() {
			this.getVoteNo();
		},
		getVoteNo() {
			this.$u.get('/wq/vote/getUid').then(res => {
				this.uid = res.msg;
			})
		},
		getAddress() {
			uni.chooseLocation({
			    success: function(res) {
					debugger
			    },
			    fail: function() {
			        uni.getSetting({
			            success: function(res) {
			                if (res.authSetting['scope.userLocation']) {
			                    uni.showModal({
			                        title: '是否授权当前位置',
			                        content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
			                        success: function(tip) {
			                            if (tip.confirm) {
			                                uni.openSetting({
			                                    success: function(data) {
			                                        if (data.authSetting["scope.userLocation"] === true) {
			                                            that.$u.toast('授权成功~');
			                                            //授权成功之后，再调用chooseLocation选择地方
			                                            this.choiseRegion()
			                                        } else {
			                                            that.$u.toast('授权失败~');
			                                        }
			                                    }
			                                })
			                            }
			                        }
			                    })
			                }
			            },
			            fail: function(res) {
			                this.$u.toast('调用授权窗口失败~');
			            }
			        })
			    }
			});
		},
		onSuccess(e) {
			if(e.code == 200){
				var url = e.data;
				this.fileList.push(url);
			}else{
				this.$u.toast('图片上传失败');
			}
		},
		onRemove(index) {
			this.fileList.splice(index, 1); 
		},
		clearText() {
			this.content = '';
		},
		submit() {
			if(this.content == ''){
				return;
			}
			this.judgeLogin((res) => {
				if(res.user.phonenumber == null || res.user.phonenumber == ''){
					this.$u.vuex('vuex_phone', true);
					return;
				}
				
				this.addDynamic();
			});
		},
		addDynamic() {
			if(this.fileList.length == 0){
				this.$u.toast('请上传照片');
				return;
			}
			var image = this.fileList.join(",");
			this.$u.post('/wq/vote/add',{
				uid: this.uid,
				message: this.content,
				image: image
			}).then(res => {
				uni.$emit('update',res.data);
				uni.navigateBack();
			});
		},
	}
}; 
</script>
<style lang="scss" scoped>
	page {
		background-color: #fff;
	}
	.page-box {
		padding: 20px;
		padding-bottom: 140rpx;
	}
	.text-box {
		padding: 5px;
	}
	
	.btn-box {
		width: 50%;
		margin-bottom: 20px;
	}
	.tag-scroll-box {
		padding: 15px 5px;
	}
	.send-btn {
		width: 50%;
		background-color: #5082e5;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 10px 20px;
		border-radius: 20px;
		font-size: 12px;
	}
	.send-btn-text {
		margin-left: 5px;
	}
	.send-box {
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		width: 100%;
		bottom: 20px;
	}
	.fabu-btn-box {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 10px;
	}
	
	.clear-btn {
		background-color: #f4f5f6;
		color: #606266;
		padding: 6px 20px;
		font-size: 12px;
		border-radius: 20px;
	}
	
	.fabu-btn {
		background-color: #5082e5;
		color: #fff;
		padding: 6px 20px;
		font-size: 12px;
		border-radius: 20px;
	}
	.btn-disabled {
		background-color: #c3aae9;
		color: #fff;
		padding: 6px 20px;
		font-size: 12px;
		border-radius: 20px;
	}
</style>
